export default class EventManager {
  // created = "";
  // updated=""
  // resize=""
  // scale=""
  MouseDown = false;
  NodeEventMap = new Map();
  EventMap = new Map();
  constructor(node) {
    this.node = node || {};
    this.NodeEventMap.set("click", "");
    this.NodeEventMap.set("wheel", "");
    this.NodeEventMap.set("mousedown", "");
    this.NodeEventMap.set("mousemove", "");
    this.NodeEventMap.set("mouseup", "");
    this.NodeEventMap.set("mouseleave", "");
    
    this.EventMap.set("created", "");
    this.EventMap.set("updated", "");
    this.EventMap.set("resize", "");
    this.EventMap.set("scale", "");
  }

  static instance() {
    if (!EventManager._instance) {
      EventManager._instance = new EventManager();
    }
    return EventManager._instance;
  }

  register(node) {
    this.node = node;

    this.onResize();
    this.bind("wheel", ({ event,pos }) => {
      
      if (event.deltaY < 0) {
        this.on("scale", { e: event, dir: "up",pos });
      } else {
        this.on("scale", { e: event, dir: "down",pos });
      }
    });
  }
  mouseDown({ event, pos }) {
    this.MouseDown = true;
    this.node.datas.currentMousePos = this.posToCanvas(
      event.clientX,
      event.clientY,
      true
    );
  }
  mousemove({ event, pos }) {
    if (this.MouseDown) {
      let movedPos = this.posToCanvas(event.clientX, event.clientY, true);

      let transform = {
        x: movedPos.x - this.node.datas.currentMousePos.x,
        y: movedPos.y - this.node.datas.currentMousePos.y,
      };

      if(transform){
        this.node.datas.UIslectNode.selected.transform.x=this.node.datas.UIslectNode.selected.transform.x+transform.x
        this.node.datas.UIslectNode.selected.transform.y=this.node.datas.UIslectNode.selected.transform.y+transform.y
     }


     this.node.RenderManager.renderAll()

      // this.datas.worldTransForm={x: this.datas.worldTransForm.x+transform.x,y:this.datas.worldTransForm.y+transform.y}
      // this.RenderManager.renderAll()

      this.node.datas.currentMousePos = this.posToCanvas(
        event.clientX,
        event.clientY,
        true
      );
   
      

      return transform;
    }
  }
  moveLeave({event,pos}){
    this.MouseDown = false;
  }
  mouseup({ event, pos }) {
    this.MouseDown = false;
  }
  onResize() {
    window.onresize = () => {
      let resize = this.EventMap.get("resize");
      resize && resize();
    };
  }

  posToCanvas(x, y, noSticky = false) {
    let datas = this.node.datas;

    // x = x / datas.worldScale.scale;
    // y = y / datas.worldScale.scale;

    let trans = {
      x: x - datas.worldTransForm.x - this.node.element.offsetLeft,
      y: y - datas.worldTransForm.y - this.node.element.offsetTop,
    };

    if (datas.stickyGrid && !noSticky) {
      trans.x = trans.x - (trans.x % (datas.gridSize * datas.worldScale.scale));
      trans.y = trans.y - (trans.y % (datas.gridSize * datas.worldScale.scale));
    }

    return trans;
  }
  bind(name, call) {
    this.EventMap.set(name, call);

    if (this.NodeEventMap.has(name)) {
      this.node.element.addEventListener(name, (event) => {
        let call = this.EventMap.get(name);

        call &&
          call({
            event,
            canvas: this.node,
            pos: this.posToCanvas(event.clientX, event.clientY),
          });
      });
    }
  }

  on(name, params) {
    let call = this.EventMap.get(name);

    call && call(params);
  }
}
